<template>
    <div class="content-main">
        <a-tabs default-active-key="0">
            <a-tab-pane v-for=" (item,index) in  WxmpMaterialTypeOPT" :key="index" :tab="item.label">
                <ImageIndex v-if="item.value==='image'" :mediaType="item.value"/>
                <VoiceIndex v-if="item.value==='voice'" :mediaType="item.value"/>
                <VideoIndex v-if="item.value==='video'" :mediaType="item.value"/>
                <NewsIndex v-if="item.value==='news'" :mediaType="item.value"/>
            </a-tab-pane>
        </a-tabs>
    </div>
</template>
<script>
    import {dictLoad} from '../../../../util/internal.api';
    export default {
        components: {
            'ImageIndex': () => import('./component/image/index'),
            'VoiceIndex': () => import('./component/voice/index'),
            'VideoIndex': () => import('./component/video/index'),
            'NewsIndex': () => import('./component/news/index'),
        },
        data() {
            return {
                //公众号素材类型字典
                WxmpMaterialTypeOPT: [],
            };
        },
        methods: {
            //数据初始化
            async init() {
                //素材类型字典
                await dictLoad('WxmpMaterialType').then(res => (this.WxmpMaterialTypeOPT = res));
            }
        },
        created() {
            this.init();
        }
    };
</script>
<style>
    .content-main {
        background-color: #ffffff;
        padding: 10px;
        box-sizing: border-box;
        width: 100%;
        height: auto;
    }
</style>
